﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="NuovoFornitoreArticolo.aspx.cs" Inherits="FimetContoDeposito.Operazioni.NuovoFornitoreArticolo" %>

<%@ Register assembly="GrayParrot.Web.Controls" namespace="GrayParrot.Web.Controls" tagprefix="cc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <asp:PlaceHolder ID="PlaceHolder1" runat="server">        
        <%: Scripts.Render("~/bundles/JQuery") %>          
        <%: Scripts.Render("~/bundles/JQueryUI") %>  
        <%: Styles.Render("~/bundles/Formly/css") %>
        <%: Scripts.Render("~/bundles/Formly") %>

        <%: Styles.Render("~/bundles/Datatables/css") %>
        <%: Scripts.Render("~/bundles/Datatables") %>
    </asp:PlaceHolder>

    <!-- Common -->
    <script type="text/javascript" lang="javascript" src="../Scripts/Formly/FormlyHelper.js"></script>
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.Core.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.Directives.Fileupload.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.Directives.DateTimePicker.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.AngularJS.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.DataTables.js"></script> 
    <script type="text/javascript" lang="javascript" src="../Scripts/GrayParrot.Modals.js"></script> 
    <!-- Common -->

    <style>
        body {
         margin: 20px
        }

        .formly-field {
            margin-bottom: 16px;
        }

        .formly.row{
            display:block;
        }

        .formly-field.section-label {
            margin-bottom: 8px
        }

        .btn-file {
            position: relative;
            overflow: hidden;
        }
        .btn-file input[type=file] {
            position: absolute;
            top: 0;
            right: 0;
            min-width: 100%;
            min-height: 100%;
            font-size: 100px;
            text-align: right;
            filter: alpha(opacity=0);
            opacity: 0;
            outline: none;
            background: white;
            cursor: inherit;
            display: block;
        }
    </style>
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <!-- 
        Sitemap Menu item:
        <siteMapNode url="~/NuovoFornitoreArticolo.aspx" title="NuovoFornitoreArticolo" description="NuovoFornitoreArticolo" image="fa-laptop" id="NuovoFornitoreArticolo"/>
    -->
    <section class="panel">
	    <header class="panel-heading">
			<h2>Nuovo Fornitore Articolo</h2>
		</header>
		<div class="panel-body">

            <!-- PUT YOUR CONTENT HERE -->
            <iframe id='iframeCrud' frameborder="0" style="width:800px; height:600px; display:none"></iframe>
            <div id="crudDialog" title="" style="display:none"></div>

            <div class="row" ng-app="formlyExample" ng-controller="MainCtrl as vm" name="divContainer" id="divContainer">
				<div class="col-md-8">
                    <div>
                        <div ng-if="vm.loadingData.$$state.status === 0" style="margin:20px 0;font-size:2em">
                            <strong>Caricamento...</strong>
                        </div>
                        <div ng-if="vm.loadingData.$$status.state !== 0">
                            <form ng-submit="vm.onSubmit()" novalidate id="formlyForm">
                                <formly-form model="vm.model" fields="vm.fields" form="vm.form">
                                </formly-form>
                            </form>
                        </div>
                    </div>
                </div>
				<div class="col-md-4">
                    <img class="img-thumbnail" ng-src="data:{{ vm.model.FotoProdotto.filetype }};base64,{{ vm.model.FotoProdotto.base64 }}" alt="Formly!" ng-show="vm.model.FotoProdotto" />
                    <img class="img-thumbnail" src="http://placehold.it/350x150/7ba9d0/fff?text=Select+an+image+%3A%29" ng-hide="vm.model.FotoProdotto" />
                </div>
            </div>
            <br />
            <div class="row">
                <cc1:JQDataTable ID="JQDTTable" runat="server" 
                        SelectionMode="Single" 
                        RenderScripts="false" 
                        BootstrapClasses="table table-hover table-bordered table-condensed">
                    <FeaturesConfig>
                        <Features>
                            <cc1:Searching Value="Both">
                                <Filters>
                                    <cc1:ColumnFilter ColumnName="Nome" Type="Text" />
                                    <cc1:ColumnFilter ColumnName="Cognome" Type="Text" />
                                </Filters>
                            </cc1:Searching>
                            <cc1:AutoWitdh Value="true" />
                            <cc1:ScrollY Value="500" ScrollCollapse="true" />
                            <cc1:LengthChange Value="true" />
                            <cc1:Paging PagingType="FullNumbers" PageLength="20" />
                        </Features>
                    </FeaturesConfig>
                    <ControllerConfig Url="/api/AnagraficaArticoli/FornitoriPerArticolo" LoadingMode="OnDemand">
                        <Validation Message="Inserire i parametri" FormId="formlyForm" />
                        <ControllerParameters>
                                <cc1:ControllerParameter Name="formly_1_asyncselect_selArticoli_0" Alias="IDArticolo"/>
                        </ControllerParameters>
                    </ControllerConfig>
                    <ColumnsConfig Key="Fornitore">
                        <Columns>
                            <cc1:TextColumn Name="Fornitore" Header="Id" visible="false" />
                            <cc1:TextColumn Name="DescrFornitore" Header="Fornitore" />
                            <cc1:NumericColumn Name="ScortaMinima" Header="Scorta Minima" />
                            <cc1:NumericColumn Name="PrezzoUnitario" Header="Prezzo Unitario" />
                            <cc1:NumericColumn Name="ScontoFornitore" Header="Sconto Fornitore" />
                            <cc1:NumericColumn Name="Note" Header="Note" />
                        </Columns>
                    </ColumnsConfig>
                    <Buttons>
                        <cc1:CrudAddButton Text="Aggiungi" Callback="LoadAddDialog" />
                        <cc1:CrudEditButton Text="Modifica" Callback="LoadEditDialog" />
                    </Buttons>
                </cc1:JQDataTable>
            </div>
		</div>
	</section>

</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="LocaJavascript" runat="server">
   <% HttpContext.Current.Response.Write(this.JQDTTable.RenderScriptsManually()); %>

   <script>
       var idToEdit = GetQueryStringParams("id");

       var settings = new FormlySettings();
       settings.container = '#divFormly';
       settings.callbackSuccess = SuccessCallback;

       if (idToEdit == undefined) {
           settings.setLoad(settings.createGetConfig('/api/AnagraficaArticoli/LoadNewFornitoreFields'));
           settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Add'));
       } else {
           settings.setLoad(settings.createGetConfig('/api/AnagraficaArticoli/LoadNewFornitoreFields', { id: idToEdit }));
           settings.setSend(settings.createPostConfig('/api/AnagraficaArticoli/Edit'));
       }

       FormlyManager(settings);

       //
       function SuccessCallback(response) {

           ShowResponseMessage(response);

           window.parent.CloseDialog();
       }

       function CambiaFoto(viewValue, modelValue, scope) {
           Empty(m_tableJQDTTable);

           var url = "/api/AnagraficaArticoli/GetFoto";

           $.ajax({
               type: "POST",
               url: url,
               data: JSON.stringify({ id: viewValue }),
               contentType: "application/json; charset=utf-8",
               dataType: "json",
               success: function (response) {
                   $(".img-thumbnail").attr("src", response);
               },
               failure: function (response) {
                   alert(response);
               }
           });
       }

       function CloseDialog(response) {
           $('#crudDialog').dialog('close');

           ShowResponseMessage(response);
       }

       function LoadAddDialog() {
           
           var m_idArticolo = $("#formly_1_asyncselect_selArticoli_0").val();

           $("#iframeCrud").prop('src', 'NuovoFornitoreArticolo_CRUD.aspx?idA=' + m_idArticolo).appendTo("#crudDialog");
           $("#iframeCrud").show();

           m_dialog = $("#crudDialog").dialog({
               title: 'Anagrafica Articoli',
               width: 'auto',
               height: 'auto',
               modal: true,
               close: function () {
                   RedrawGrid(m_tableJQDTTable);

                   $("#iframeCrud").contents().remove();
                   $('#iframeCrud').hide();
               }
           });
       }

       function LoadEditDialog() {

           var p = null;
           var m_idArticolo = $("#formly_1_asyncselect_selArticoli_0").val();

           p = GetSelectedData(m_tableJQDTTable).Fornitore;

           var url = 'NuovoFornitoreArticolo_CRUD.aspx?idF=' + p + "&idA=" + m_idArticolo;

           $("#iframeCrud").prop('src', url).appendTo("#crudDialog");
           $("#iframeCrud").show();

           m_dialog = $("#crudDialog").dialog({
               title: 'Anagrafica Articoli',
               width: 'auto',
               height: 'auto',
               modal: true,
               close: function () {
                   RedrawGrid(m_tableJQDTTable);

                   $("#iframeCrud").contents().remove();
                   $('#iframeCrud').hide();
               }
           });
       }
   </script>
</asp:Content>